{% extends "base.html" %}

{% block nav %}
<li class="active">
    <i class="fa fa-mobile-phone "></i> 应用发布
</li>
{% endblock %}

{% block content %}

<div class="row">
  <div class="col-md-12">
  	<form id='onlineForm' action="/ops/online" method="POST" >
  		<span style="padding-left:20px"><label> 选择项目：</label></span>
  		<select name='project'>
  			{% for project in projects %}
  				<option>{{ project }}</option>
  			{% endfor %}
		</select>

  		<span style="padding-left:20px"><input id='onlineButton' class="btn btn-primary btn-sm" type="submit" value="上线"></span>
  	</form>
  	<hr>
  </div >
  <div class="col-md-8">
	  <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 100%;">40% Complete
	  </div>
	  <hr><hr>
  
  	{% if result %}
	  <div class="col-md-12" style='padding-top:40px;'>
		  <table class="table">
		  	 <thead>
			    <tr>
			      <th >ip地址</th>
			      <th >执行状态</th>
			      <th >执行结果</th>
			    </tr>
			</thead>
			{% for data in result %}
				{% if not result[data]['code'] %}
					<tr class="success">
				{% else %}
					<tr class="danger">
				{% endif %}
					<td id='ip'><a href="http://{{result[data]['ip']}}">{{ result[data]['ip'] }}</a></td>
					<td id='status'>{{ result[data]['code'] }}</td>
					<td id='content'><pre> {{ result[data]['data']['content'] }}</pre></td>
				</tr>
			{% endfor %}
		  </table>
	  </div>
	{% endif %}
	</div>

</div>
{% endblock %}

{% block js %}
<!--
<script type="text/javascript">
	$(document).ready(function(){
				//添加机房
				$('#onlineButton').click(function(e) {
					// 获取值转义
					var postValue = $('#onlineForm').serialize();
					// 禁止submit按钮生效
					e.preventDefault();
					alert(postValue)

					$.post('/ops/online',postValue,function(data){
						//判断运行结果
						if ( data.code != 0){
							//错误添加消息
							$('table tr:eq(1)').removeClass().addClass('danger')
							$('table tr:eq(1) td:eq(2) pre').text(data.message);
						}
						else{
							// 正确添加内容
							$('table tr:eq(1)').removeClass().addClass('success')
							$('table tr:eq(1) td:eq(2) pre').text(data.data.content);
						}
						//添加IP地址与状态
						$('table tr:eq(1) td:eq(0)').text(data.ip);
						$('table tr:eq(1) td:eq(1)').text(data.code);
					});
				});
			});
</script>
-->
{% endblock %}